<template>
  <TableView
    ref="tableView"
    :table-attrs="{
      api: fetchList,
      descs: ['create_time'],
      dicOptions: [{ prop: 'checkinGender', dicType: 'gender' }]
    }"
    form-path="/space/fyroomstorey/storeyForm/{id:-1}"
    :search-model="searchForm"
    :delete-api="batchDelete"
    :tree-listeners="{ 'node-click': onNodeClick }"
    :tree-attrs="{
      fetchApi: edificeTree,
      show: true,
      treeProps: { label: 'name' },
      lazy: false,
      'expand-first-node': true,
      customRootNode: { name: '全部', id: -1 }
    }"
    :toolbar-attrs="{
      buttons: ['slot', { del: 'storey_fyroomstorey_del', create: 'storey_fyroomstorey_add' }]
    }">
    <template #toolbar-button>
      <ToolbarButton
        privilege="storey_fyroomstorey_add"
        type="primary"
        icon="el-icon-plus"
        label="批量新增"
        @click="$router.push('/space/fyroomstorey/storeyBatchForm/-1')" />
    </template>
    <template #columns>
      <TableColumn label="所属楼栋" prop="edificeName" width="105" />
      <TableColumn label="楼层名称" clickable prop="name" width="145" />
      <TableColumn label="楼层编码" clickable prop="code" width="145" />
      <TableColumn label="入住性别" prop="checkinGender" width="105" />
      <TableColumn label="备注" prop="remarks" />
    </template>
    <template #search-form>
      <FormInput v-model="searchForm.edificeName" label="所属楼栋" prop="edificeName" />
      <FormInput v-model="searchForm.name" label="楼层名称" prop="name" max-length="255" />
      <FormInput v-model="searchForm.checkinGender" label="入住性别" prop="checkinGender" />
      <FormInput v-model="searchForm.remarks" label="备注" prop="remarks" max-length="3000" />
    </template>
  </TableView>
</template>

<script>
  import { services } from '@/config'
  import { fetchList, batchDelete } from '@/api/space/fyroomstorey'
  import { edificeTree } from '@/api/space/fyspacetree'

  export default {
    name: 'StoreyView',
    data() {
      return {
        searchForm: {
          edificeName: null,
          name: null,
          checkinGender: null,
          remarks: null,
          dataCode: null,
          edificeId: null
        }
      }
    },
    methods: {
      batchDelete,
      edificeTree,
      fetchList,
      onNodeClick(node) {
        this.searchForm.dataCode = node.dataCode
        this.$refs.tableView.onSearchClick()
      },
      exportExcel() {
        this.$downBlobFile(`${services.spaceService}fyroomstorey/export`, this.searchForm, `楼层管理${this.$dateFormat(new Date())}.xlsx`)
      }
    }
  }
</script>
